import React, { PureComponent } from 'react';
import { connect } from 'dva';

import { Row, Col, Icon, Form, Button, Avatar, InputNumber, Select, Popconfirm, Modal, AutoComplete, Input, Divider } from 'antd';

import styles from './styles.less';

const FormItem = Form.Item;
const Option = Select.Option;

const ModelName = "inv";
@connect(({ loading, invItemCategory, currency }) => ({
  loading: loading.models[ModelName],
  cates: invItemCategory.list,
  curs: currency.list,
}))
@Form.create()
class Comp extends PureComponent {

  constructor(props) {
    super(props);

    const { getInstance } = props;
    if (typeof getInstance === 'function') {
      getInstance(this);
    }
  }

  componentDidMount() {

  }

  render() {
    const { form: { getFieldDecorator }, cates, curs } = this.props;
    const { current, visible, onOk, onCancel } = this.props;

    const getModalContent = () => {
      const formLayout = {
        labelCol: {
          lg: { span: 6 },
          xs: { span: 6 },
          sm: { span: 6 },
        },
        wrapperCol: {
          xs: { span: 15 },
          sm: { span: 15 },
        },
        style: {
          marginBottom: '1.5em',
        }
      };

      return (
        <Form onSubmit={this.handleSubmit}>
          <FormItem label="费用描述"  {...formLayout}>
            {getFieldDecorator(`invItemCategoryId`, {
              rules: [{ required: true, message: '请输入类型' }],
              initialValue: current.invItemCategoryId,
            })(
              <Select style={{ width: '100%' }}>
                {cates.map(p => <Option value={p.id} key={p.id}>{p.objectName}</Option>)}
              </Select>
            )}
          </FormItem>
          <FormItem label="数量" {...formLayout} hasFeedback={false} >
            {getFieldDecorator(`qty`, {
              initialValue: current.qty,
            })(<InputNumber style={{ width: '100%' }} />)}
          </FormItem>          
          <FormItem label="单价" {...formLayout}>
            {getFieldDecorator(`price`, {
              initialValue: current.price,
            })(<InputNumber style={{ width: '100%' }} />)}
          </FormItem>
          <FormItem label="货币" {...formLayout}>
            {getFieldDecorator(`currencyId`, {
              initialValue: current.currencyId,
            })(
              <Select style={{ width: '100%' }} >
                {curs.map(p => <Option value={p.id} key={p.id}>{p.objectName}</Option>)}
              </Select>
            )}
          </FormItem>
        </Form>
      );
    };

    return (
      <Modal
        title={'编辑'}
        destroyOnClose
        visible={visible}
        onOk={onOk}
        onCancel={onCancel}
      >{getModalContent()}
      </Modal>
    );
  }
}

export default Comp;

